<template>
    <div>

        <div v-for="item in msglist">
          
          {{ item }}

        </div>

    </div>
</template>

<script>
export default {
    data() {
        return {
            msglist:[],
        }
    },

    mounted:function(){
        
        var _this = this;

        //判断浏览器是否支持websocket
        if("WebSocket" in window){

            console.log("支持");
            //生成websocket链接
            var ws = new WebSocket("ws://localhost:8000/websocketlink/");

            //发送链接请求
            ws.onopen = function(){

                ws.send("test");
            }

        }

        //发送消息,收到消息
        ws.onmessage = function(evt){

            //将获取信息打印
            var received_msg = evt.data;

            //alert(received_msg);
            _this.msglist.push(received_msg);

        }

        //捕获断开链接
        ws.onclose = function(){

            console.log("链接已经关闭");
        }
    }

}
</script>

<style>

</style>